<script setup lang="ts">
  import { ref } from 'vue'
  import { VueFlow } from '@vue-flow/core'
  import type { Node, Position } from '@vue-flow/core'
  import BeginNode from './node/begin-node/index.vue'
  import EndNode from './node/end-node/index.vue'
  import LlmNode from './node/llm-node/index.vue'
  import AgentNode from './node/agent-node/index.vue'
  import ToolNode from './node/tool-node/index.vue'
  import VecttorNode from './node/vector-node/index.vue'
  import PromptNode from './node/prompt-node/index.vue'
  import SwitchNode from './node/switch-node/index.vue'

  const nodes = ref<Node[]>([
    {
      id: '1',
      type: 'begin',
      position: { x: 0, y: 300 },
    },
    {
      id: '2',
      type: 'end',
      position: { x: 1300, y: 300 },
      data: {
        label: '结束节点',
        content: [
          {
            name: 'group',
            isRequired: true,
            type: 'string',
            id: 1,
          },
          {
            name: 'age',
            isRequired: true,
            type: 'number',
            id: 2,
          },
          {
            name: 'agSEXe',
            isRequired: false,
            type: 'string',
            id: 3,
          },
        ],
      },
    },
    {
      id: '3',
      type: 'llm',
      position: { x: 700, y: 600 },
    },
    {
      id: '4',
      type: 'switch',
      position: { x: 300, y: 100 },
    },
    {
      id: '5',
      type: 'prompt',
      data: {
        label: '提示词1',
        icon: 'material-symbols:notifications-unread-outline',
        content: {
          name: '岗位描述模版1',
        },
        desc: '你好，我是一个提示词，我只能有1个测试测试测试测试测试测试测试测试试测试测试11111',
      },
      position: { x: 700, y: 0 },
    },

    {
      id: '6',
      type: 'tool',
      position: { x: 700, y: 200 },
    },
    {
      id: '7',
      type: 'vector',
      data: { label: 'Vector', sub: { name: '协同知识文档' } },
      position: { x: 700, y: 400 },
    },
    {
      id: '8',
      type: 'agent',
      data: { label: 'Agent', agent: '协同问答Agent' },
      position: { x: 1000, y: 300 },
    },
  ])
</script>

<template>
  <VueFlow :nodes="nodes" :auto-connect="true">
    <!-- 开始节点 -->
    <template #node-begin="props">
      <BeginNode v-bind="props" />
    </template>
    <!-- 结束节点 -->
    <template #node-end="props">
      <EndNode v-bind="props" />
    </template>
    <!-- 大模型节点 -->
    <template #node-llm="props">
      <LlmNode v-bind="props" />
    </template>
    <!-- 分支节点 -->
    <template #node-switch="props">
      <SwitchNode v-bind="props" />
    </template>
    <!-- agent节点 -->
    <template #node-agent="props">
      <AgentNode v-bind="props" />
    </template>
    <!-- tool节点 -->
    <template #node-tool="props">
      <ToolNode v-bind="props" />
    </template>
    <!-- 提示词节点 -->
    <template #node-prompt="props">
      <PromptNode v-bind="props" />
    </template>
    <!-- 向量库节点 -->
    <template #node-vector="props">
      <VecttorNode v-bind="props" />
    </template>
  </VueFlow>
</template>
<style scoped lang="less"></style>
